<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<link rel="stylesheet" href="css/remove.css">
	<link rel="stylesheet" href="css/sign.css">
</head>
<body>
	<header>
		<div class="header-top">
			<div class="header-top-con">
				<ul>
					<li><a href="">
						订单追踪
						<i class="icon-headerf icon-new-first"></i>
					</a></li>
					<li><a href="">
						帮助中心
						<i class="icon-headers icon-new-second"></i>
					</a></li>
					<li><a href="">
						在线客服
						<i class="icon-headert icon-new-third"></i>
					</a></li>
					<li><a class="user" href="sign.html">
						登录
						<i id="login" class="icon-headerl icon-new-last"></i>
					</a></li>
				</ul>
			</div>
		</div>
		<div class="header-con">
			<div class="header-con-left">
				<h1>
					<img src="img/first/logo-new.png" alt="">
				</h1>
				<ul>
					<li><a href="list.html">男子</a></li>
					<li><a href="">女子</a></li>
					<li><a href="">儿童</a></li>
					<li><a href="">|</a></li>
					<li><a href="">运动</a></li>
					<li><a href="">品牌</a></li>
					<li><a href="">精选系列</a></li>
				</ul>
			</div>
			<ul class="header-con-right">
				<li class="header-seach">
					<i></i>
					<input type="" placeholder="冬季甄选">
				</li>
				<li>
					<i class="icon-cart"></i>
				</li>
			</ul>
		</div>
	</header>
	<article>
		<div class="content">
			<div class="login-box">
				<h4>
					<span class="show">账号密码登录</span>
					<span>账号密码注册</span>
				</h4>
				<div id="con">
					<div class="con-1" style="display: block;">
						<input type="text" placeholder="用户名" class="username s-username">
						<input type="password" placeholder="密码" class="password s-password">
						<input type="checkbox" class="check"><span class="check-s">记住密码</span>
						<h3 class="s">登录</h3>
					</div>
					<div class="con-1">
						<input type="text" placeholder="用户名" class="username r-username">
						<input type="password" placeholder="密码" class="password r-password">
						<h3 class="r">注册</h3>
					</div>
				</div>
				<hr>
				<p class="third">使用其他方式登录</p>
				<p class="method">
					<span class="icon icon-wei"></span>
					<span class="icon icon-tao"></span>
					<span class="icon icon-bo"></span>
				</p>
			</div>
		</div>
		<div class="login-right">
			<h4>ADICLUB会员相关权益</h4>
			<p>成为adiCLUB会员并完善个人信息，即可享受更多权益：</p>
			<ul>
				<li><span class="icon"></span>安全快捷支付订单</li>
				<li><span class="icon"></span>随时跟踪订单状态</li>
				<li><span class="icon"></span>及时收到打折优惠及新品发布信息</li>
				<li><span class="icon"></span>全场免普通达运费和七天无理由退换胡服务</li>
				<li><span class="icon"></span>消费即可获得积分,铜牌以上会员即可积分兑换优惠券</li>
			</ul>
		</div>
	</article>

	<div class="footer-top">
		<div class="footer-top-con">
			<ul>
				<li>联系我们</li>
				<li>
					<i class="icon icon-ke"></i>
					在线客服
				</li>
				<li>
					<i class="icon icon-phone"></i>
					400-999-5999
				</li>
				<li>
					<i class="icon icon-email"></i>
					server@adidas.com
				</li>
				<li>
					<i class="icon icon-time"></i>
					9:00-22:00
				</li>
			</ul>
			<div class="right">
				<i class="icon icon-zhui"></i>
				订单追踪
			</div>
		</div>
	</div>
	<div class="footer-con">
		<ul>
			<ul>
				<li class="foot-procuct">产品</li>
				<li>鞋类</li>
				<li>服装</li>
				<li>配件</li>
				<li>最新上市</li>
				<li>新品发售日历</li>
				<li>限量发售</li>
			</ul>
			<ul>
				<li class="foot-procuct">运动</li>
				<li>跑步</li>
				<li>训练</li>
				<li>足球</li>
				<li>篮球</li>
				<li>户外</li>
			</ul>
			<ul>
				<li class="foot-procuct">帮助中心</li>
				<li>关于员工</li>
				<li>尺码表</li>
				<li>adiCLUB会员</li>
				<li>门店查询</li>
				<li>关于我们</li>
				<li>企业社会责任</li>
				<li>ADIDAS APP</li>
			</ul>
			<ul>
				<li class="foot-procuct">网站政策</li>
				<li>使用条款</li>
				<li>隐私声明</li>
				<li>物流配送规则</li>
				<li>退换货规则</li>
				<li>adiCLUB会员规则</li>
				<li>下单指南</li>
				<li>印制服务条款</li>
			</ul>
		</ul>
		<div class="right">
			<p class="foot-procuct">关注我们</p>
			<span class="icon-span span1"></span>
			<span class="icon-span span2"></span>
		</div>
		<div class="right">
			<p class="foot-procuct">职业发展</p>
			<span class="icon-span span3"></span>
		</div>
	</div>
	<ul class="footer-method">
		<li>我们接受下列付款方式：</li>
		<li class="icon icon-zhi"></li>
		<li class="icon icon-wei"></li>
		<li class="icon icon-yin"></li>
	</ul>
	<div class="text">
		<p>企业团购热线及邮箱：&nbsp;&nbsp;&nbsp;团购热线：021-2525 6861</p>
		<p>团购邮箱：adidas.com  (仅限采购金额10万以上)</p>
	</div>
	<div class="footer-bot">
		<div class="footer-bot-con">
			<p class="p1">
				<span class="icon icon-china"></span>
				<span>中国</span>
				<span>隐私声明</span>
				<span>使用条款</span>
				<span>网站地图</span>
				<span>&copy;阿迪达斯体育(中国)有限公司保留所有权利</span>
			</p>
			<p class="p2">
				<span>苏ICP备14048805号-1</span><span class="icon icon-hui"></span><span>&copy;2019adidas江苏工商</span><span class="icon icon-hui"></span><span>苏公安网安备32059002001401号</span>
			</p>
		</div>
	</div>
	
	<script src="js/jquery.min.js"></script>
	<script>

		let spanList = document.querySelectorAll(".login-box>h4 span");
		let cont = document.getElementsByClassName("con-1");
		function comput(index){
			for(let i = 0; i < spanList.length; i++){
				spanList[i].className = "";
			}
			spanList[index].className = "show";
			for(let i = 0; i < cont.length; i++){
				cont[i].style.display = "none";
			}
			cont[index].style.display = "block";
		}
		spanList[0].onclick = function(){
			comput(0);
		}
		spanList[1].onclick = function(){
			comput(1);
		}
		$(".r").click(function(){
			let username = $(".r-username").val();
			let password = $(".r-password").val();
			$(".r-username").val("");
			$(".r-password").val("");
			$.ajax({
				url:"http://10.35.164.241:8080/resiger",
				data:{
					username:username,
					password:password
				},
				success:function(data){
					if (data === "success") {
						alert("注册成功");
					}
					if (data === "exist") {
						alert("该用户已存在");
					}
				}
			})
		})

		$(".s").click(function(){
			let username = $(".s-username").val();
			let password = $(".s-password").val();
			$(".s-username").val("");
			$(".s-password").val("");
			$.ajax({
				url:`http://10.35.164.241:8080/login?username=${username}&password=${password}`,
				success:function(data){
					if(data === "error" || username === "" || password === "") {
						alert("用户名或密码输入有误");
						return;
					}
					if($(".check").prop("checked")){
						localStorage.setItem("username",username);
						localStorage.setItem("password",password);
					}
					if(data === "success"){
						sessionStorage.setItem("showusername",username);
						window.history.go(-1);
					}
				}
			})
		})
	</script>
</body>
</html>